<template>
	<view>
		<!-- 导航 -->
		<uni-nav-bar 
		leftWidth='200rpx' rightWidth='200rpx'
		@clickLeft="$utils.ret()" left-icon="left" leftText="返回" title="修改手机号" height="130rpx" />
		<!-- 资料 -->
		<view class="info">
			<view class="item">
				<view class="iconfont icon-xiugaishoujimima"></view>
				<input type="text" placeholder="输入手机号">
			</view>
			<view class="item1">
				<view class="iconfont icon-mima" style="color: #92e4ad; font-size: 55rpx;"></view>
				<input type="text" placeholder="输入验证码">
				<view class="auth">获取验证码</view>
			</view>
			
		</view>
		<!-- 下一步 -->
		<view class="save">
			<button type="primary" @click="$utils.go('/pages/amend/phone2')">下一步</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style lang="less">
	// @import url(/static/iconfont/iconfont.css);

	page {
		width: 100%;
		height: 100%;
		background-color: #f6f4f5;
	}

	// 导航
	
	/deep/.uni-navbar__content {
		border: none;
	}

	// 资料
	.info {
		background-color: #ffffff;
		padding-left: 20px;
		padding-right: 25rpx;

		.item {
			height: 100rpx;
			box-sizing: border-box;
			border-bottom: 2rpx solid #f7f7f7;
			display: flex;
			line-height: 100rpx;

			.iconfont {
				color: #dc9b8b;
				font-size: 35rpx;

			}

			input {
				color: #a4a4a4;
				margin-left: 30rpx;
				height: 100rpx;
			}
		}
		.item1 {
			height: 100rpx;
			box-sizing: border-box;
			border-bottom: 2rpx solid #f7f7f7;
			position: relative;
			display: flex;
			line-height: 100rpx;
		
			.iconfont {
				color: #dc9b8b;
				font-size: 35rpx;
		
			}
		
			input {
				color: #a4a4a4;
				margin-left: 10rpx;
				height: 100rpx;
			}
			.auth{
				color: #47a3ed;
				font-size: 30rpx;
				position: absolute;
				right: 25rpx;
			}
		}
	}

	// 保存
	.save {
		margin-top: 90rpx;
		height: 75rpx;

		button {
			width: 515rpx;
			border-radius: 50rpx;
			border: none;
			background-color: #1f8fff;
			color: #fff;
		}
	}
</style>